<template>
    <div class="header">
        <div class="icon"></div>
        <h1 class="text">DO-Player</h1>
        <router-link tag="div" class="mine" to="/user">
            <i class="icon-mine"></i>
        </router-link>
    </div>
</template>
<script>
export default {
    data(){
        return{

        }
    }
}
</script>
<style lang="stylus" scoped>
    @import "~assets/stylus/variable"
    .header
        position relative
        height .88rem
        text-align center
        color $color-theme
        font-size 0
        .icon
            display: inline-block
            vertical-align: top
            margin-top: .12rem
            width: .6rem
            height: .64rem
            margin-right: .18rem
            bg-image('logo')
            background-size: .6rem .62rem
        .text
            display: inline-block
            vertical-align: top
            line-height: .88rem
            font-size: $font-size-large
        .mine
            position: absolute
            top: 0
            right: 0
        .icon-mine
            display: block
            padding: .24rem
            font-size: .4rem
            color: $color-theme

</style>
